<%@page import="com.skeleton.db.dto.ShowinfoDto"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>后台</title>
	<script type="text/javascript" src="<%=request.getContextPath() %>/resource/jquery-1.8.2.js"></script>
	<script type="text/javascript" src="<%=request.getContextPath() %>/resource/jquery.blockUI.js"></script>
	<style type="text/css">
		body {
			margin: 0px;
			padding: 0px;
			font-family: 微软雅黑;
		}
		
		.fl {
			float: left;
		}
		
		.fr {
			float: right;
		}
		
		.cb {
			clear: both;
		}
		
		.main {
			font-size: 24px;
		}
		
		.sub {
			font-size: 20px;
			margin: 20px 0px;
		}
		
		.item1 {
			background-color: #f8f8f8;
			margin-left: 30px; 
			border: 1px solid #ffffff;
		}
		
		.item2 {
			border-bottom-color: #ffffff;
			margin-left: 30px; 
			border: 1px solid #ffffff;
		} 
		
		.item2:HOVER, .item1:HOVER {
			border: 1px solid #ff0000;
		}
		
		.item {
			font-size: 14px;
			margin: 4px 0 5px 9px;
		}
		
		.icon {
			width: 30px;
		}
		
		.title {
			width: 240px;
		}
		
		.time {
			width: 140px;
		}
		
		.people {
			width: 190px;
		}
		
		.commnet {
			width: 320px;
		}
		
		.option {
			width: 90px;
		}
		
	</style>
	<script type="text/javascript">
		$(function() {
// 			$("li").click(function() {
// 				$("li ul").hide();
// 				$(this).children("ul").show(); 
// 			});
			$('.div1').each(function() {
				$(this).mouseover(function(e) {
					$(this).css({"border":"1px solid blue"});
					$(this).find("div").find("div").eq(1).show();
					
				});
				$(this).mouseout(function() {
					$(this).css({"border":"1px solid red"});
					$(this).find("div").find("div").eq(1).hide();
				});
			});
		});
		
		function add(a,b,c) {
			$('#addmain').html(a);
			$('#addsub').html(c);
			$('#addsubId').val(b);
	        $.blockUI({ css: {top: 100}, message: $('#addDiv') }); 
		}
		
		function modify(id) {
			$.ajax({
				url: "<%=request.getContextPath() %>/admin/modifyItemInfo",
				type: "post",
				data: {
					id: id
				},
				dataType: "json",
				success: function(res) {
					var r = res.result;
					if(r == "success") {
						var dto = res.dto;
						var name = dto.showTitle;
						name = name.replace("<br />","\n");
						$('#itemName').val(name);
						var commnet = dto.showCommnet;
						commnet = commnet.replace("<br />","\n");
						$('#itemDesc').val(commnet);
						$('#itemStatus').val(dto.showStatus);
						$('#itemId').val(dto.showId);
						$('#people').val(dto.showPeople);
						$('#start').val(dto.startDttmStr);
						$('#end').val(dto.endDttmStr);
					}
				}
			});
	        $.blockUI({ css: {top: 100},  message: $('#modifyDiv') }); 
		}
		
		function addclose() {
			$.unblockUI();
		}
		
	</script> 
</head>
<body>
	<h2>工程进度展示管理后台</h2> 
	<hr />
	<div style="width: 100%; height: 100%;"> 
		<div style="margin: 0 auto; width: 1100px;">
			<div>
				<form action="<%=request.getContextPath() %>/admin/addmain" method="post" onsubmit="return confirm('确定添加？')">
					添加一级菜单：<input type="text" name="mainName"/><input type="submit" value="添加一级菜单"/>
				</form>
			</div>
			<div>
				<form action="<%=request.getContextPath() %>/admin/addsub" method="post" onsubmit="return confirm('确定添加？')">
					添加二级菜单：
					<select name="mainId">
						<%
							List<ShowinfoDto> list = (List<ShowinfoDto>)request.getAttribute("list");
							for(int i=0; i<list.size(); i++) {
								ShowinfoDto dto = list.get(i);
								if(dto.getShowId().length() == 3) {
						%>
						<option value="<%=dto.getShowId() %>"><%=dto.getShowTitle() %></option>
						<%		
								}
							}
						%>
					</select>
					<input type="text" name="subName"/><input type="submit" value="添加二级菜单"/>
				</form>
			</div>
		<%
			if(list != null) {
				for(int i=0; i<list.size(); i++) {
					ShowinfoDto dto = list.get(i);
					if(dto.getShowId().length() == 3) {
		%>
			<div class="main">
				<%=dto.getShowTitle() %>
				<a href="<%=request.getContextPath() %>/admin/deleteMain?id=<%=dto.getShowId() %>" onclick="return confirm('确定删除？')">删除整个一级菜单</a>
				<a href="<%=request.getContextPath() %>/admin/deleteAllDate?id=<%=dto.getShowId() %>">清空数据状态</a>
			</div>
			<div>
				<%
					for(int j=0; j<list.size(); j++) {
						ShowinfoDto dto2 = list.get(j);
						if(dto2.getShowId().length() == 6 && dto2.getShowId().substring(0, 3).equals(dto.getShowId())) {
				%>
				<div class="sub">
					<%=dto2.getShowTitle() %>
					<a href="javascript: add('<%=dto.getShowTitle() %>', '<%=dto2.getShowId() %>', '<%=dto2.getShowTitle() %>')">添加新项</a>
					<a href="<%=request.getContextPath() %>/admin/deleteSub?id=<%=dto2.getShowId() %>" onclick="return confirm('确定删除？')">删除整个二级菜单</a>
				</div>
				<div>
						<%
							int nn = 0;
							for(int k=0; k<list.size(); k++) {
								ShowinfoDto dto3 = list.get(k);
								if(dto3.getShowId().length() == 9 && dto3.getShowId().substring(0, 6).equals(dto2.getShowId())) {
									nn++;
									if(nn%2 == 0) {
						%>
						<div class="item2">
						<%
									} else {
						%>
						<div class="item1">
						<%
									}
						%>
							<div class="item fl icon">
								<%
									char status = dto3.getShowStatus();
									if (status == '1') {
								%>
										<img alt="" src="<%=request.getContextPath() %>/resource/checkmark.png" width="20" height="20">
								<%
									}
									if (status == '2') {
								%>
										<img alt="" src="<%=request.getContextPath() %>/resource/cross.png" width="20" height="20">
								<%
									}
								%>
							</div>
							<div class="item fl title"><%=dto3.getShowTitle() %></div>
							<div class="item fl people"><%=dto3.getShowPeople() %></div>
							<div class="item fl time">
							<%
								String time = dto3.getFinishDttmStr();
								if (time != null) {
									out.println(time);
								}
							%>
							</div>
							<div class="item fl commnet"><%=dto3.getShowCommnet() %></div>
							<div class="item fl option">
								<a href="<%=request.getContextPath() %>/admin/deleteItem?id=<%=dto3.getShowId() %>" style="text-decoration: none;" onclick="return confirm('确定删除？')">删除</a>
								/
								<a href="javascript: modify('<%=dto3.getShowId() %>')">修改</a>
							</div>
							<div class="cb"></div>
						</div>
						<%
								}
							}
						%>
				</div>
				<%
						}
					}
				%>
			</div>
		<%
					}
				}
			}
		%>
	
		</div>
	</div>
			
	<div id="addDiv" style="display: none;">
		<form action="<%=request.getContextPath() %>/admin/additem" method="post" onsubmit="return confirm('确定添加？')">
			添加新项<br />
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				一级菜单：
			</div>
			<div id="addmain" class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
			</div>
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				二级菜单：
			</div>
			<div id="addsub" class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
			</div>
			<input type="hidden" name="subId" value="" id="addsubId"/>
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				新项名称：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<textarea name="itemName" rows="3" cols="20" style="width: 200px;"></textarea>
			</div>
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				负责人（部门）：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<input type="text" name="people" style="width: 200px;"/>
			</div> 
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				预计启动时间：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<input type="text" name="start" style="width: 200px;" value="2013年06月18日 09时00分00秒"/>
			</div> 
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				预计结束时间：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<input type="text" name="end" style="width: 200px;" value="2013年06月19日 09时00分00秒"/>
			</div> 
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				备注：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<textarea name="desc" rows="3" cols="20" style="width: 200px;"></textarea>
			</div> 
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<input type="submit" value="添加"/>
				<input type="button" value="关闭" onclick="addclose()"/>
			</div>
			<div class="cb"></div>
		</form>
	</div>
	<div id="modifyDiv" style="display: none;">
		<form action="<%=request.getContextPath() %>/admin/modifyitem" method="post" onsubmit="return confirm('确定修改？')">
			修改<br />
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				项目名称：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<textarea name="itemName" rows="3" cols="20" id="itemName" style="width: 200px;"></textarea>
			</div>
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				负责人（部门）：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<input type="text" name="people" id="people" style="width: 200px;"/>
			</div> 
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				预计启动时间：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<input type="text" name="start" value="2013-06-18 09:00:00" id="start" style="width: 200px;"/>
			</div> 
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				预计结束时间：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<input type="text" name="end" value="2013-06-19 09:00:00" id="end" style="width: 200px;"/>
			</div> 
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				备注：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<textarea name="itemDesc" rows="3" cols="20" id="itemDesc" style="width: 200px;"></textarea>
			</div>
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
				状态：
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<select name="itemStatus" id="itemStatus">
					<option value="0">新建</option>
					<option value="1">完成</option>
					<option value="2">错误</option>
				</select>
				<input type="checkbox" name="isUpdate"/>是否更新时间
			</div>
			<div class="cb"></div>
			<div class="fl" style="width: 150px; margin-top: 10px; text-align: right;">
			</div>
			<div class="fl" style="width: 200px; margin-top: 10px; text-align: left;">
				<input type="submit" value="修改"/>
				<input type="button" value="关闭" onclick="addclose()"/>
			</div>
			<div class="cb"></div>
			<input type="hidden" name="id" value="" id="itemId"/>
		</form>
	</div>
</body>
</html>